import React from 'react';
import ReactDOM from 'react-dom';
import { Modal, Button ,Form,Input,message} from 'antd';
import QRCode from 'qrcode';

export default class QrCodeModal extends React.Component {
    constructor(props, context){
        super(props, context);
        this.state={};
    }
    componentDidUpdate() {
      var {qrCodeContent} = this.props;
      if(!qrCodeContent) return;
      var qrcodedraw = new QRCode.qrcodedraw();
      qrcodedraw.draw(document.getElementById('qrcode'),qrCodeContent, function(error,canvas){
          if(error){
             message.error("发生错误");
          }
      });
    }
    
    render() {
      var {visible,onCancel,qrCodeContent} = this.props;
      return (
          <Modal
            visible={visible}
            title="微信扫一扫"
            onCancel={onCancel}
            bodyStyle={{textAlign:'center'}}
            footer={[
              <Button 
                key="back"
                size="large" 
                onClick={onCancel}
              >
                取消
              </Button>
            ]}
          >
            <canvas id="qrcode" ></canvas>
          </Modal>
      );
    }
}
QrCodeModal.contextTypes= { router: React.PropTypes.object.isRequired};
